<template>
	<div>
		<!-- <film-swiper>
      <film-swiper-item
			v-for="data in datalist"
			:key="data.id"
			class="filmswiperitem"
      >
			<img :src="data.imgUrl" />
      </film-swiper-item>
		</film-swiper> -->

		<film-header class="sticky"></film-header>

		<router-view></router-view>
	</div>
</template>
<script>
import filmSwiper from "@/components/films/FilmSwiper.vue";
import filmSwiperItem from "@/components/films/FilmSwiperItem.vue";
import filmHeader from "@/components/films/FilmHeader.vue";
import axios from "axios";
export default {
data() {
	return {
      datalist: [],
	};
},
mounted() {
    // this.datalist = ['aaa','bbb','ccc']
	axios.get("/banner.json").then((res) => {
      this.datalist = res.data.banner;
		});
},
	components: {
		filmSwiper,
		filmSwiperItem,
		filmHeader,
	},
};
</script>

<style lang="scss" scoped>

.filmswiperitem {
	img {
		width: 6.25rem;
		height: 7.8125rem;
	}
}
.sticky {
	position: sticky;
	top: 0;
	background: white;
	z-index: 100;
}
html {
  overflow-y: scroll;
}

:root {
  overflow-y: auto;
  overflow-x: hidden;
}

:root body {
  position: absolute;
}

body {
  width: 100vw;
  overflow: hidden;
}
</style>
